<template>
  <div>
    <p>
     姓名: <input v-model="name" type="text">
    </p>
    <p>
     性别: <input v-model="gender" name="sex" type="radio" value="男">男 <input v-model="gender" name="sex" type="radio" value="女">女
    </p>
    <p>
      爱好:
      <input v-model="aihao" type="checkbox" value="吃饭"> 吃饭<input type="checkbox" v-model="aihao" value="学习"> 学习
    </p>
     <p>
       籍贯:<select v-model="home">
         <option value="wh">武汉</option>
         <option value="cd">成都</option>
         <option value="sz">深圳</option>
       </select>
    </p>
    <p>
      <textarea v-model="brief"></textarea>
    </p>
    <p><button @click="doClick">提交</button></p>
    
  </div>
</template>

<script>
export default {
  data() {
    return {
      name:'张三',
      gender:'男',
     aihao:['吃饭'],
     home:'wh',
     brief:'我叫什么~~~~'
    }
  },
  methods: {
    doClick(){
      console.log(this.name);
      console.log(this.gender);
      console.log(this.aihao);
      console.log(this.home);
      console.log(this.brief);
    }
  },
}
</script>